// ajax请求参数
let params = {
  pagenum: 1, // 获取第1页的数据
  pagesize: 2,// 每页2条数据
  // state:
  // cate_id:
};

// 封装函数，获取文章，渲染到tbody中
function renderArticle() {
  axios.get('/my/article/list', { params }).then(res => {
      console.log(res.data);
      let { status, data, total } = res.data;
      if (status === 0) {
        let str = '';
        data.forEach(item => {
          str += `<tr>
          <td>${item.title}</td>
          <td>${item.cate_name}</td>
          <td>${item.pub_date}</td>
          <td>${item.state}</td>
          <td>
            <button type="button" class="layui-btn layui-btn-xs">编辑</button>
            <button type="button" class="layui-btn layui-btn-xs layui-btn-danger">删除</button>
          </td>
        </tr>`
        });
        $('tbody').html(str);
        // 处理完数据，调用分页函数
        showPage(total);
      } 
  });
}

renderArticle();

// -------------------- 分页 --------------------
let laypage = layui.laypage;
// 执行一个laypage实例
function showPage(t) {
  laypage.render({
    elem: 'page', // 注意，这里的 test1 是 ID, 不用加 # 号
    count: t, // 数据总数，从服务端得到
    limit: params.pagesize, // 每页显示几条
    curr: params.pagenum, // 当前页
    // prev: '上一篇'
    limits: [2, 3, 5, 10], // 下拉框的选项
    layout: ['limit', 'prev', 'page', 'next', 'count', 'skip'],
    // jump表示切换分页的回调
    jump: function (obj, first) {
      // 首次不执行
      if (!first) {
        // do something
        // obj包含了当前分页的所有参数，比如：
        console.log(obj.curr); // 得到当前页，以便向服务端请求对应页的数据。
        console.log(obj.limit); // 没到每页显示的条数
        params.pagenum = obj.curr;
        params.pagesize = obj.limit;
        renderArticle();
      }
    }
  });
  
 }


// --------------------------- 筛选 -------------------------
// 获取真实的分类
axios.get ('/my/category/list').then(res => {
  let { status, data } = res.data;
  if ( status ===  0 ) {
    // console.log(data);
    let str = '';
    data.forEach(item => {
      str += `<option value="${item.id}">${item.name}</option>`;
    });
    $('#category').append(str);
     // 更新渲染
     let form = layui.form;
     form.render('select');
  }
}); 

// 完成筛选
$('#search').on('submit', function (e) {
  e.preventDefault();
  // 获取下拉框的两个值
  let cate_id = $('#category').val();
  let state = $('#state').val();
  // console.log(cate_id, state);
  // 设置请求参数
  if (cate_id) {
    params.cate_id = cate_id;
  } else {
    // delete用于删除对象的属性
    delete params.cate_id;
  }

  if (state) {
    params.state = state;
  } else {
    delete params.state;
  }

  // 筛选的时候，重置pagenum=1
  params.pagenum = 1;

  // 发送请求，获取文章
  renderArticle();

})

